<!--
 * @Author: daidai
 * @Date: 2022-02-28 16:16:42
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2022-07-20 17:57:11
 * @FilePath: \web-pc\src\pages\big-screen\view\indexs\left-center.vue
-->
<template>
     <div class="block">
          <el-carousel  :interval="2000" arrow="always" height="250px">
            <el-carousel-item v-for="(item,index) in bannerData" :key="index">
              <img :src="item.bannerImg" height="250px" width="500px"/>
            </el-carousel-item>
          </el-carousel>
        </div>
</template>

<script>
import { currentGET } from 'api/modules'

export default {
    data() {
        return {
            bannerData:[],
            timer: null,
        };
    },
    created() {
        this.getData()
        setInterval(this.getData, 10000);
    },
    mounted() {
    },
    methods: {
        getData() {
            currentGET("big41").then((res) => {
                this.bannerData= res.rows;
            });
        },
    },
};
</script>
<style lang='scss' scoped>
 .el-carousel__item img {
    color: #475669;
    font-size: 14px;
    opacity: 0.75;
    line-height: 150px;
    margin: 0;
  }

  .el-carousel__item:nth-child(2n) {
     background-color: #99a9bf;
  }
  
  .el-carousel__item:nth-child(2n+1) {
     background-color: #d3dce6;
  }
</style>